// 检查用户是否已登录
function checkLogin() {
    const currentUser = localStorage.getItem('currentUser');
    if (!currentUser) {
        // 未登录，跳转到登录页面
        window.location.href = 'index.html';
        return false;
    }
    return true;
}

// 登出功能
function logout() {
    // 清除本地存储的用户信息
    localStorage.removeItem('currentUser');
    // 跳转到登录页面
    window.location.href = 'index.html';
}

// 如果未登录，直接返回
if (!checkLogin()) {
    // 阻止继续执行
    throw new Error('用户未登录');
}

// API基础URL
const API_BASE_URL = 'http://localhost:3001/api';

// 当前编辑的用户ID
let currentEditUserId = null;

// 渲染表格数据
function renderTableData(data) {
    console.log('渲染数据:', data);
    const tableBody = document.getElementById('userTableBody');
    tableBody.innerHTML = '';

    if (!data || data.length === 0) {
        const row = document.createElement('tr');
        row.innerHTML = '<td colspan="7" style="text-align: center;">暂无数据</td>';
        tableBody.appendChild(row);
        return;
    }

    data.forEach((item, index) => {
        const row = document.createElement('tr');
        row.innerHTML = 
            '<td>' + item.id + '</td>' +
            '<td>' + item.username + '</td>' +
            '<td>' + item.gender + '</td>' +
            '<td>' + item.phone + '</td>' +
            '<td>' + item.unit_name + '</td>' +
            '<td>' + (item.manager_id ? '是' : '否') + '</td>' +
            '<td>' +
                '<div class="action-buttons">' +
                    '<button class="edit-btn" data-id="' + item.id + '">修改</button>' +
                    '<button class="delete-btn" data-id="' + item.id + '">删除</button>' +
                '</div>' +
            '</td>';
        tableBody.appendChild(row);
    });

    // 重新绑定事件监听器
    bindEventListeners();
}

// 从API获取所有用户数据
async function fetchUsers() {
    try {
        console.log('正在获取用户数据...');
        const response = await fetch(API_BASE_URL + '/users');
        console.log('响应状态:', response.status);
        
        if (!response.ok) {
            throw new Error('HTTP error! status: ' + response.status);
        }
        
        const users = await response.json();
        console.log('获取到的用户数据:', users);
        renderTableData(users);
    } catch (error) {
        console.error('获取用户数据失败:', error);
        alert('获取用户数据失败，请检查服务器是否运行正常');
    }
}

// 绑定事件监听器
function bindEventListeners() {
    // 编辑按钮功能
    document.querySelectorAll('.edit-btn').forEach(button => {
        button.addEventListener('click', function (e) {
            e.stopPropagation();
            const id = this.getAttribute('data-id');
            editUser(id);
        });
    });

    // 删除按钮功能
    document.querySelectorAll('.delete-btn').forEach(button => {
        button.addEventListener('click', function (e) {
            e.stopPropagation();
            const id = this.getAttribute('data-id');
            deleteUser(id);
        });
    });

    // 表格行点击高亮功能
    document.querySelectorAll('.data-table tbody tr').forEach(row => {
        row.addEventListener('click', function () {
            // 移除其他行的高亮
            document.querySelectorAll('.data-table tbody tr').forEach(r => {
                r.style.backgroundColor = '';
            });
            // 高亮当前行
            this.style.backgroundColor = '#e0f7fa';
        });
    });
}

// 删除用户
async function deleteUser(id) {
    if (!confirm('确定要删除ID为 ' + id + ' 的用户记录吗?')) {
        return;
    }

    try {
        const response = await fetch(API_BASE_URL + '/users/' + id, {
            method: 'DELETE'
        });
        
        if (!response.ok) {
            throw new Error('HTTP error! status: ' + response.status);
        }
        
        const result = await response.json();
        console.log('删除用户成功:', result);
        alert('用户删除成功');
        // 重新加载数据
        fetchUsers();
    } catch (error) {
        console.error('删除用户失败:', error);
        alert('删除用户失败，请检查服务器是否运行正常');
    }
}

// 编辑用户
async function editUser(id) {
    try {
        const response = await fetch(API_BASE_URL + '/users/' + id);
        if (!response.ok) {
            throw new Error('HTTP error! status: ' + response.status);
        }
        const user = await response.json();
        
        // 填充表单数据
        document.getElementById('userId').value = user.id;
        document.getElementById('username').value = user.username;
        document.getElementById('password').value = ''; // 不显示密码
        document.getElementById('gender').value = user.gender;
        document.getElementById('phone').value = user.phone;
        document.getElementById('unit_name').value = user.unit_name;
        document.getElementById('manager_id').value = user.manager_id;
        
        // 设置当前编辑的用户ID
        currentEditUserId = user.id;
        
        // 更改模态框标题
        document.getElementById('modalTitle').textContent = '修改用户';
        
        // 显示模态框
        document.getElementById('userModal').style.display = 'block';
    } catch (error) {
        console.error('获取用户信息失败:', error);
        alert('获取用户信息失败，请检查服务器是否运行正常');
    }
}

// 搜索功能
async function filterData() {
    const username = document.getElementById('searchUser').value.toLowerCase();
    
    try {
        const response = await fetch(API_BASE_URL + '/users');
        if (!response.ok) {
            throw new Error('HTTP error! status: ' + response.status);
        }
        const users = await response.json();
        
        const filteredData = users.filter(item => {
            return item.username.toLowerCase().includes(username);
        });
        
        renderTableData(filteredData);
    } catch (error) {
        console.error('搜索用户数据失败:', error);
        alert('搜索用户数据失败，请检查服务器是否运行正常');
    }
}

// 保存用户（新增或修改）
async function saveUser(event) {
    event.preventDefault();
    
    const userId = document.getElementById('userId').value;
    const userData = {
        username: document.getElementById('username').value,
        password: document.getElementById('password').value,
        gender: document.getElementById('gender').value,
        phone: document.getElementById('phone').value,
        unit_name: document.getElementById('unit_name').value,
        manager_id: parseInt(document.getElementById('manager_id').value)
    };
    
    try {
        let response;
        if (userId) {
            // 修改用户
            response = await fetch(API_BASE_URL + '/users/' + userId, {
                method: 'PUT',
                headers: {
                    'Content-Type': 'application/json'
                },
                body: JSON.stringify(userData)
            });
        } else {
            // 新增用户
            response = await fetch(API_BASE_URL + '/users', {
                method: 'POST',
                headers: {
                    'Content-Type': 'application/json'
                },
                body: JSON.stringify(userData)
            });
        }
        
        if (!response.ok) {
            throw new Error('HTTP error! status: ' + response.status);
        }
        
        const result = await response.json();
        console.log((userId ? '修改用户成功:' : '新增用户成功:'), result);
        alert(userId ? '用户修改成功' : '用户新增成功');
        
        // 关闭模态框
        document.getElementById('userModal').style.display = 'none';
        
        // 重新加载数据
        fetchUsers();
        
        // 重置表单
        document.getElementById('userForm').reset();
    } catch (error) {
        console.error((userId ? '修改用户失败:' : '新增用户失败:'), error);
        alert(userId ? '修改用户失败，请检查服务器是否运行正常' : '新增用户失败，请检查服务器是否运行正常');
    }
}

// 关闭模态框
function closeModal() {
    document.getElementById('userModal').style.display = 'none';
    document.getElementById('userForm').reset();
    currentEditUserId = null;
    document.getElementById('modalTitle').textContent = '新增用户';
}

// 初始化页面
document.addEventListener('DOMContentLoaded', function () {
    console.log('页面加载完成，开始获取用户数据...');
    // 获取并渲染初始数据
    fetchUsers();

    // 搜索按钮事件
    document.getElementById('searchButton').addEventListener('click', filterData);

    // 新增按钮事件
    document.getElementById('addButton').addEventListener('click', function() {
        // 重置表单
        document.getElementById('userForm').reset();
        currentEditUserId = null;
        document.getElementById('modalTitle').textContent = '新增用户';
        // 显示模态框
        document.getElementById('userModal').style.display = 'block';
    });

    // 回车键搜索功能
    document.getElementById('searchUser').addEventListener('keypress', function (e) {
        if (e.key === 'Enter') {
            filterData();
        }
    });

    // 登出链接事件
    const logoutLink = document.getElementById('logoutLink');
    if (logoutLink) {
        logoutLink.addEventListener('click', function(e) {
            e.preventDefault();
            logout();
        });
    }

    // 模态框相关事件
    // 保存按钮事件
    document.getElementById('userForm').addEventListener('submit', saveUser);
    
    // 取消按钮事件
    document.getElementById('cancelBtn').addEventListener('click', closeModal);
    
    // 关闭按钮事件
    document.querySelector('.close').addEventListener('click', closeModal);
    
    // 点击模态框外部关闭
    window.addEventListener('click', function(event) {
        const modal = document.getElementById('userModal');
        if (event.target === modal) {
            closeModal();
        }
    });

    // 导航栏交互
    document.querySelectorAll('.sidebar nav ul li a').forEach(link => {
        link.addEventListener('click', function (e) {
            // 移除所有活动状态
            document.querySelectorAll('.sidebar nav ul li a').forEach(l => {
                l.classList.remove('active');
            });
            // 为当前点击的链接添加活动状态
            this.classList.add('active');

            // 这里可以添加页面切换逻辑
            console.log('导航到:', this.querySelector('.title').textContent);
        });
    });
});